<template>
	<view class="card_view">
		<view v-for="(item,index) in goods" :key="index">
			<image :src="item.url" mode="aspectFill"></image>
			<text class="title">{{item.goods_name}}</text>
			<text class="falsehood">{{item.falsehood}}</text>
			<text class="artillery">{{item.artillery}}</text>
		</view>
	</view>
</template>
<script setup>
	import { ref } from 'vue'
	const goods = ref([{
			url:'https://cn.vuejs.org/assets/state-flow.nejaO_VQ.png',
			goods_name:'技术栈',
			falsehood:123,
			artillery:'vue3'
	},
	{
			url:'https://cn.vuejs.org/assets/AccessibleLabelChromeDevTools.nffWedHr.png',
			goods_name:'开发工具中检查这个元素',
			falsehood:13,
			artillery:'vue'
	},
	{
			url:'https://cn.vuejs.org/assets/AccessibleARIAlabelledbyDevTools.-7O7_Klw.png',
			goods_name:'能需要的附加',
			falsehood:31,
			artillery:'react'
	},
	{
			url:'https://cn.vuejs.org/assets/AccessiblePlaceholder.CLyTokFf.png',
			goods_name:'开发',
			falsehood:311,
			artillery:'watchtv'
	}])
	
</script>
<style lang="less">
	.card_view{
		background-color:"#f7f7f7";
		display:grid;
		grid-template-columns:repeat(2,1fr);
		text{display: block;}
		image{width: 100%;height:240px;border-radius:10px}
		view{margin: 0 10px;padding:5px;background-color:#fff;border-radius:10px;}
	}
</style>